<template>
  <div class="home-swiper">
        <mt-swipe :auto="4000">
          <mt-swipe-item v-for="(list,index) in swiper" :key="index">
            <img :src="list.img">
          </mt-swipe-item>
        </mt-swipe>
        <input @click="xuangou" type="text" placeholder="搜索关键词和标签">
        <img class="search_pic fl" src="/static/img/icon_search.png">
  </div>
</template>

<script>
export default {
  name:"HomeSwipe",
  data(){
    return{
      swiper:[
        {
          img:"../static/img/home_banner_bh.jpg"
        },
        {
          img:"../static/img/home_banner_sj.jpg"
        },
        {
          img:"../static/img/home_banner_jz.jpg"
        },
        {
          img:"../static/img/home_banner_ny.jpg"
        },
        {
          img:"../static/img/home_banner_qc.jpg"
        }
      ]
    }
  },
   methods: {
      xuangou:function(){
      this.$router.push({path:"parts"})
    }
  }
}
</script>


<style lang="stylus" scoped>
    .home-swiper
        height 4.5rem;
        margin-top 1rem;
        position relative
        overflow-x scroll
        input 
            width 75%
            height .7rem
            border-radius 1rem
            position absolute
            top .2rem
            left .6rem
            font-size .3rem
            padding-left .7rem
        .search_pic{
          width 0.4rem
          height 0.4rem
          position absolute
          top .34rem
          left .8rem
        }
        img
            width 100%;
            height 4.5rem
</style>